<template>
    <view>
              <view class="search-group">
                        <view class="title" v-if="hl.length">
                            搜索历史
                            <view class="clear" @tap="clearStorage">清除搜索历史</view>
                        </view>
                        <view class="list">
                             
                                  <view
                                       v-for="(item,index) in hl" 
                                       :key="index" class="item"
                                        @tap="selectItem(item)">{{item}}</view>
                          
                           
                        </view>
                </view>


                <!-- <view class="search-group">
                        <view class="title">
                            热门搜索
                            
                        </view>
                        <view class="list">
                            <view class="item">美卡</view>
                            <view class="item">克丽缇娜</view>
                            <view class="item">美容美发</view>
                        </view>
                </view> -->
    </view>     
</template>
<script>

export default {
        props:{
            hl:{
                type:Array,
                default:[]
            }
        },
        methods:{
            selectItem(str){
                    this.$emit('setSelectItem',str)
            },
            clearStorage(){
                    uni.showModal({
                          title: '提示',
                          content: '确定清除搜索历史?',
                          success:res=>{
                              if (res.confirm) {
                                      this.$emit('clearSearchHistroyList',[]);
                                }
                          }

                    })
                    
            }
        }
        
}
</script>
